@extends('admin.common.base-master')

@section('html-head')
    {{--<link href="{{url('/vendor/tyupload/control/css/zyUpload.css')}}" type="text/css" rel="stylesheet" />--}}
    <link href="{{url('css/jquery.form.css')}}" type="text/css" rel="stylesheet" />
    {{--<script src="{{url('/vendor/My97DatePicker/WdatePicker.js')}}"></script>--}}
    <script src="{{url('/js/lib/jquery.form.js')}}"></script>

    <style>
        .btn_add_classify{
            background: #31bcd3;margin-left:10px;height: 5px;width: 50px;color: white;text-align: center;padding:5px;border-radius:7px;box-shadow: 3px 2px 9px #888888;
        }
    </style>
@endsection

@section('html-body')
    <!-- content start -->
    <div id="content">
        <!-- cur-position start -->
        <div id="cur-position">
            <span class="tit">当前位置：</span>

                <a href="{{route('Admin.Home.goodsList')}}">商品管理</a>
            <em> > </em>

                <a href="{{route('Admin.Home.goodsSpuList')}}?goods_id={{$goodsId}}">商品属性列表</a>

            <em> > </em>
            <a href="#">商品属性设置</a>
        </div>
        <!-- cur-position end -->

        <div class="gg-step">
            <form  id="advform">
                <input type="hidden" name="id" id="goodsSpu" value="@if($thisGoodsSpu){{$thisGoodsSpu->id}}@endif"/>
                <input type="hidden" name="goods_id" id="goods_id" value="{{$goodsId}}"/>
                <div class="gg-list">
                    <label class="tit">尺码属性名</label>
                    <div class="cont">
                        <input class="gg-ipt" type="text" placeholder="请输入尺码的属性名" name="size_spu_name" id="size_spu_name" value="@if($thisGoodsSpu){{$thisGoodsSpu->size_spu_name}}@else @if($value){{$value->size_spu_name}}@endif @endif" /><cite id="title_re" class="required">*</cite>
                        <p class="text">可输入2-40个字符（一个汉字等于2个字符）</p>
                    </div>
                </div>

                <div class="gg-list">
                    <label class="tit">颜色属性名</label>
                    <div class="cont">
                        <input class="gg-ipt" type="text" placeholder="请输入颜色的属性名" name="color_spu_name" id="color_spu_name" value="@if($thisGoodsSpu){{$thisGoodsSpu->color_spu_name}}@else @if($value){{$value->color_spu_name}}@endif @endif" /><cite id="title_re" class="required">*</cite>
                        <p class="text">可输入2-40个字符（一个汉字等于2个字符）</p>
                    </div>
                </div>

                <div class="gg-list">
                    <label class="tit">规格编码</label>
                    <div class="cont">
                        <input class="gg-ipt" type="text" placeholder="请输入规格编码" name="specification_code" id="specification_code" value="@if($thisGoodsSpu){{$thisGoodsSpu->specification_code}}@else @if($value){{$value->specification_code}}@endif @endif" /><cite id="title_re" class="required">*</cite>
                        <p class="text">可输入2-40个字符（一个汉字等于2个字符）</p>
                    </div>
                </div>

                <div class="gg-list" data-id="ggzst2">
                    <label class="tit">属性封面图</label>
                    <div class="demo" style="display: inline-block; padding: 0; margin: 0; *display: inline; *zoom:1;">
                        <input type = "hidden" name = "pic_img" id = "pic_img2" value = "" height="70px" >
                        <div id="showimg">
                        </div>
                        <div class="btn" style="background: #00A2D4">
                            <span id="inputImage">添加图片</span>
                            <input id="img_id" type="hidden" name="thumb_id" value="@if($thisGoodsSpu && $thisGoodsSpu->thumb_id){{$thisGoodsSpu->thumb_id}} @endif">
                        </div>
                        <div class="progress">
                            <span class="bar"></span><span class="percent">0%</span >
                        </div>
                        <p class="text" id="uploadthumb">上传详情图（图片格式为jpg、png、gif，规格：高限315px,文件小于2MB）</p>
                        @if($thisGoodsSpu && $thisGoodsSpu->thumb_id != 0)<img id="img_show" style="width: 100px;padding-top: 3px;" src="{{\App\Http\Services\FileManager::getImgUrl($thisGoodsSpu->thumb_id)}}" />@endif

                    </div>
                </div>
{{--                <div class="gg-list">--}}
{{--                    <label class="tit">属性类型</label>--}}
{{--                    <div class="cont">--}}
{{--                        <select name="type" id="type">--}}
{{--                            <option value="size" @if($thisGoodsSpu && $thisGoodsSpu->type == 'size')selected @endif>尺码</option>--}}
{{--                            <option value="color" @if($thisGoodsSpu && $thisGoodsSpu->type == 'color')selected @endif>颜色</option>--}}
{{--                        </select>--}}
{{--                    </div>--}}
{{--                </div>--}}

                <div class="gg-list">
                    <label class="tit">商品价格</label>
                    <div class="cont">
                        <input class="gg-ipt" type="text" placeholder="请输入商品价格" name="price" id="price" value="@if($thisGoodsSpu){{$thisGoodsSpu->price}}@else @if($value){{$value->price}}@endif @endif" /><cite id="title_re" class="required">*</cite>
                        <p class="text">可输入数值（整数或小数）</p>
                    </div>
                </div>

                <div class="gg-list">
                    <label class="tit">商品库存</label>
                    <div class="cont">
                        <input type="text" class="gg-ipt" placeholder="请输入商品库存" name="stock" id="stock" value="@if($thisGoodsSpu){{$thisGoodsSpu->stock}}@else @if($value){{$value->stock}}@endif @endif"><cite id="title_re" class="required">*</cite>
                        <p class="text">可输入数值（注意是整数）</p>
                    </div>
                </div>

                <div class="gg-list">
                    <label class="tit">排序</label>
                    <div class="cont">
                        <input type="text" class="gg-ipt" placeholder="请输入排序" name="sort" id="sort" value="@if($thisGoodsSpu){{$thisGoodsSpu->sort}}@else @if($value){{$value->sort+1}}@endif @endif"><cite id="title_re" class="required">*</cite>
                        <p class="text">可输入整数数值（数值越小越靠前）</p>
                    </div>
                </div>
                
                <div class="gg-list">
                    <label class="tit">状态</label>
                    <div class="cont">
                        <select name="status" id="status">
                            <option value="1" @if($thisGoodsSpu && $thisGoodsSpu->status == 1) selected @endif>启用</option>
                            <option value="0" @if($thisGoodsSpu && $thisGoodsSpu->status == 0) selected @endif>停用</option>
                        </select>
                    </div>
                </div>

            </form>
            <div class="gg-list" >
                <label class="tit">&nbsp;</label>
                <div class="cont" >
                    <a href="javascript:;" class="next-step" id="btn-set">提交</a>
                </div>
            </div>
        </div>
    </div>

    <!-- content end -->
    <script>
        $(function() {

            $(document).on('click', '#btn-set', function () {
                var size_spu_name          = $('#size_spu_name').val();
                var color_spu_name         = $('#color_spu_name').val();
                var specification_code     = $('#specification_code').val();
                var img_id           = $('#img_id').val();
                var price            = $('#price').val();
                var goodsId          = $('#goods_id').val();
                var stock            = $('#stock').val();
                var sort             = $('#sort').val();
                var status           = $('#status option:selected').val();
                var type             = $('#type option:selected').val();
                var activityGroupId  = $('#activity_group_id').val();
                var manyPrice        = $('#many_price').val();
                var id               = $('#goodsSpu').val();

                $.ajax({
                    url: '{{route("Api.Admin.goods.setGoodsSpu")}}',
                    type: 'post',
                    dataType: 'json',
                    data: {
                        size_spu_name: size_spu_name,
                        color_spu_name: color_spu_name,
                        specification_code: specification_code,
                        img_id: img_id,
                        price: price,
                        goods_id: goodsId,
                        stock:stock,
                        sort:sort,
                        status:status,
                        type:type,
                        activity_group_id:activityGroupId,
                        many_price:manyPrice,
                        id:id
                    },
                    success: function (obj) {
                        if (obj.level == "success") {
                            noty({
                                text: obj.message, type: obj.level, timeout: 600,
                                callback: {
                                    afterClose:function(){
                                        {{--if(type == 'group'){--}}
                                        {{--    window.location.href = "{{route('Admin.Home.groupGoodsSpuList')}}?goods_id="+goodsId+'&activity_group_id='+activityGroupId;--}}
                                        {{--}else{--}}
                                            window.location.href = "{{route('Admin.Home.goodsSpuList')}}?goods_id="+goodsId;
                                        // }
                                    }
                                }
                            });
                        } else if (obj.level == "error") {
                            noty({text: obj.message, type: obj.level, timeout: 600});
                        }

                    },
                    error: function (obj) {
                        console.log(obj);
                    }
                });
            });
        });

        //缩略图上传代码
        var uploader = new plupload.Uploader({
            runtimes: 'html5,flash,silverlight,html4',
            browse_button: 'inputImage',
            url: '{{route("Api.File.upload")}}',

            chunk_size: '20mb',
            filters: {
                max_file_size: '20mb',
                mime_types: [
                    {title: "Image files", extensions: "jpg,gif,png"}
                ],
                prevent_duplicates: false
            },
            multi_selection: true,
            unique_names: true,

            flash_swf_url: '{{ url('vendor/plupload-2.1.2/Moxie.swf') }}',
            silverlight_xap_url: '{{ url('vendor/plupload-2.1.2/Moxie.xap') }}',

            file_data_name: 'photo',
            headers: {
                Accept: 'application/json'
            },

            multipart_params: {},

            init: {
                PostInit: function () {
                },

                FilesAdded: function (up, files) {
                    up.start();
                },

                BeforeUpload: function (up, file) {
                    up.settings.multipart_params.file_name = file.name;
                },

                UploadProgress: function (up, file) {
                    $('#uploadthumb').html('<span style="color:red">上传中...</span>');
                },

                Error: function (up, err) {
                    var responseObj = '', responseMessage = '';
                    try {
                        responseObj = $.parseJSON(err.response);
                        responseMessage = responseObj.message;
                    } catch ($e) {

                    }

                    noty({
                        type: 'error',
                        text: err.message + ' ' + responseMessage,
                        timeout: 800
                    });
                },

                FileUploaded: function (up, file, info) {
                    var responseObj = '', responseMessage = '';
                    try {
                        responseObj = $.parseJSON(info.response);
                        responseMessage = responseObj.message;
                    } catch ($e) {

                    }
                    if (responseObj.level == "success") {
                        $('#img_id').val(responseObj.data.id);
                        var imgURL = responseObj.data.img_url + "?" + Math.random();
                        $('#img_show').attr("src",imgURL);
                        $('#uploadthumb').html('<span style="color:green">上传成功</span>');
                    } else {
                        noty({type: responseObj.level, text: responseObj.message, timeout: 800});
                        $('#uploadthumb').html('<span style="color: red">上传失败，请重新上传！</span>');
                    }

                }
            }
        });
        uploader.init();
    </script>
@endsection